NumberEditor = {

}

function NumberEditor:input(k)
    local str = self.label.string..k
    local number = tonumber(str)
    if number then
        self.label.string = tostring(number)
    end
end

function NumberEditor:backspace()
    local str = self.label.string
    if string.len(str) > 0 then
        local byteoffset = utf8.offset(str, -1)
        if byteoffset then
            local s = string.sub(str, 1, byteoffset - 1)
            local number = tonumber(s)
            if number then
                self.label.string = tostring(number)
            end
        end
    end
end

function Node.NumberEditor(textName, value)


    local node = Node.new():wh(200, 25):addComponent(NumberEditor)
    node:addComponent(HoverArea)
    node:addComponent(FocusArea)
    node:axy(0, 0)

    local content = node
    if value == nil then
        value = textName
    else
        local line = Node.Layout():addTo(node):addComponent(Stretch)
        line:wh(200, 25)
        line:axy(0, 0)
        line.layoutType = LayoutType.Horizontal
        Node.Label(textName):addTo(line)
        content = line
    end

    local bg = Node.Scale9("roundedBox48"):addComponent(Stretch):addTo(content)
    bg.interactable = false

    local border = Node.Scale9("roundedBorder48"):addComponent(Stretch):addTo(bg)
    border.interactable = false
    -- border.style = Styles.border
    border.styleTarget = node

    local label = Node.Label(tostring(value)):addTo(bg):addComponent(Align)
    label.color = Color32.new(40,164,248)
    label.ax = 0
    label.alignPercentX = 0
    label.alignOffsetX = 5
    label.interactable = false
    return node, label
end
